import React, {useState} from "react";
import {defaultPagination, paginationTool} from "@/utils/util";
import {useMount, useRequest} from "ahooks";
import {
  adminPayment,
  cancelOrder,
  cloudDeliveryPayment,
  findByPageOrderList,
  shipments
} from "@/services/ant-design-pro/order";
import ProTable from "@ant-design/pro-table";
import OrderShow from "@/components/OrderShow";
import {getResult} from "@/services/ant-design-pro/attribute";
import {Button, Input, Popconfirm} from "antd";

import {useLocation} from 'umi';
import OrderShenhe from "@/components/OrderShenhe";
import EditDialog from "@/pages/order/editDialog";
import EditOrderDialog from "@/pages/order/editOrderDialog";


const getAttr = async (key: string) => {
  let result = await getResult ( key, 1 );
  return result
}


const columns = [{
  title: "编号",
  key: "id",
  dataIndex: "id",
  search: false,
}, {
  title: "下单人员",
  key: "userName",
  dataIndex: "userName",


}, {
  title: "手机号",
  key: "phone",
  dataIndex: "phone",


}, {
  title: "订单号",
  key: "sn",
  dataIndex: "sn"
}, {
  title: "第三方订单",
  key: "partySn",
  dataIndex: "partySn"
}, {
  title: "支付方式",
  key: "paymentMethod",
  dataIndex: "paymentMethod",
  valueType: "select",
  valueEnum: await getResult ( 'paymentMethod', 0 )
}, {
  title: "支付状态",
  key: "paymentStatus",
  dataIndex: "paymentStatus",
  valueType: "select",
  valueEnum: await getResult ( 'paymentStatus', 0 )
}, {
  title: "支付金额",
  key: "paymentAmount",
  dataIndex: "paymentAmount",
  valueType: 'money',
  search: false,
},
  /*  {
    title: "优惠金额",
    key: "discountAmount",
    dataIndex: "discountAmount",
    valueType: 'money',
    search: false,
  }, {
    title: "支付总额",
    key: "totalAmount",
    dataIndex: "totalAmount",
    valueType: 'money',
    search: false,
  },*/
  {
    title: "产品总数",
    key: "quantity",
    dataIndex: "quantity",
    search: false,
  }, {
    title: "支付时间",
    key: "paymentDate",
    dataIndex: "paymentDate",
    valueType: 'dateTime',
    search: false,
  }, {
    title: "订单时间",
    key: "createDate",
    dataIndex: "createDate",
    valueType: 'dateRange',
    hideInTable: true,
    // initialValue: [moment().calendar(), moment().add(10, 'days').calendar()],
  }, , {
    title: "订单时间",
    key: "createDate",
    dataIndex: "createDate",
    valueType: 'dateTime',
    search: false
  }, {
    title: "操作人员",
    key: "operatorName",
    dataIndex: "operatorName",
    search: false,

  }]
const Page: React.FC = () => {

  const {query} = useLocation ();
  //findByPageOrderList
  const [pagination, setPagination] = useState<API.Pagination> ( defaultPagination () );
  const [params, setParams] = useState<any> ( query );
  const [fahuo, setFaHuo] = useState<any> ( "" );
  const {
    run: fetchByPageList,
    refresh,
    data: dataList,
    loading,
  } = useRequest ( findByPageOrderList, {
    debounceWait: 100,
    manual: true,
  } );


  useMount ( () => {
      // @ts-ignore
      // @ts-ignore
    // @ts-ignore
    columns[14] = {
        title: '操作',
        key: 'option',
        valueType: 'option',
      // @ts-ignore
        render: (_: any, row: { id: number | undefined; isPay: number | undefined; paymentStatus: number | undefined; }, index: any, action: any) => [
          <OrderShow row={row} id={row.id}/>,

          row?.isPay == 0 ?
            <>

              <OrderShenhe onSuccess={((we) => {
               refresh ()
              })} row={row} id={row.id}/>
              <Popconfirm title={"支付确定吗？"}
                          onConfirm={() => adminPayment ( row.id ).then ( () => {
                         refresh ()
                          } )}>
              <Button icon="￥" type="primary"
              >支付</Button>
            </Popconfirm>
              <Popconfirm title={"云代发支付确定吗？"}
                          onConfirm={() => cloudDeliveryPayment ( row.id ).then ( () => {
                            refresh ()
                          } )}>
                <Button icon="￥" type="primary" danger
                >云代发</Button>
              </Popconfirm>
            </> : "",
          row?.paymentStatus != 3 && row?.status == 2 ? <> <Button
              onClick={() => cancelOrder ( row.id ).then ( () => {
                refresh ()
              } )}>取消</Button>
              <Popconfirm
                title={<Input onChange={(e) => {
                  let value = e.target.value;
                  console.log ( value )
                  setFaHuo ( value )
                  console.log ( fahuo )
                }}/>}

                onConfirm={() => shipments ( row.id ).then ( (res) => {
                  refresh ()
                } )}
                okText="Yes"
                cancelText="No"
              >
                <Button danger>发货</Button>
              </Popconfirm>
            </> :
            ""
        ],
      }
      //   const p = useLocation();
      console.log ( "onDataSourceChange", query )

      fetchByPageList ( params );
    }
  )
  ;


  return (<ProTable

  search={false}
  dataSource={dataList?.data?.list}
  loading={loading}
  pagination={paginationTool ( pagination, dataList?.data?.total, (data1: API.Pagination) => {
    setPagination ( data1 );

    fetchByPageList ( {...data1, ...params} );
  } )}
  search={{
    defaultCollapsed: false,
    labelWidth: 'auto',
  }}
  onSubmit={(params) => {
    // fetchByPageList ( params );
    console.log ( 'onSubmit', params );
    setParams ( {...params} )
    fetchByPageList ( params );
  }}
  toolBarRender={()=>[<EditOrderDialog type={query?.type}  onSuccess={refresh} />]}
  cardBordered={true}
  columns={columns}
  />)
}

export default Page;
